<%@ page language="java" import="java.util.*" contentType="text/html; charset=UTF-8" %>
<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <title>无标题文档</title>
</head>
<script src="js/vue.js"></script>
<script src="js/jquery-1.12.4.js"></script>
<script src="js/vue-router.min.js"></script>
<script src="js/axios.min.js"></script>
<body>
<div id="app">
    <form action="reg!add">

        <p>就诊科室*
            <select name="registry.department.id">
                <option v-if="j.department!=null" v-for="(j,index) in users" :value="j.department.id">{{j.department.name}}</option>
            </select>
        </p>
        <p>时间段*
            <select name="registry.schedule.id">
                <option v-if="i.sign==1" v-for="(i,index) in sche" :value="i.sign">上午</option>
                <option v-if="i.sign==2" v-for="(i,index) in sche" :value="i.sign">下午</option>
            </select>
        </p>
        <p>就诊医生*
            <select name="registry.sysUsers.id" @blur="room()" id="sele">
                <option  v-for="(item,index) in users" v-if="item.id!=1" :value="item.id" >{{item.userName}}</option>
            </select>
        </p>
        <p v-for="(y,index) in rooms" >房间号* <input type="text" :value="y.room.name"></p>



        <p v-for="(j,index) in rooms" ><input type="hidden" name="registry.room.id" :value="j.room.id"></p>

        <p>身份证号* <input type="text" id="card"  @blur="card()"></p>
        <p v-for="(i,index) in cards"><input type="hidden" name="registry.patient.id" :value="i.id"></p>
        <p v-for="(d,index) in cards">病人姓名* <input type="text"  placeholder="请输入病人姓名" :value="d.name" disabled="disabled"></p>
        <p v-for="(f,index) in cards">手机号* <input type="text" placeholder="请输入手机号" :value="f.phone"  disabled="disabled"></p>
        <p v-for="(e,index) in cards">家庭地址* <input type="text" placeholder="请输入家庭地址" :value="e.address"  disabled="disabled"></p>
        <p v-for="(g,index) in cards">出生日期* <input type="text" disabled="disabled"></p>
        <p v-for="(h,index) in cards">性别* <input type="text" disabled="disabled"  :value="h.sex==1?'男':'女'"></p>
        <p> <input type="submit" value="保存"></p>
    </form>

</div>

<script>
    var app=new Vue({
        el:"#app",
        data:{
            users:[],
            sche:[],
            cards:[],
            rooms:[]
        },
        methods:{
            goto(){
                $.getJSON({

                    type: "GET",  //提交类型必须与服务器要求的一致
                    url: "user!queryAll",   //远程服务器接口的地址请求后端
                    success: function (json) {
                        app.users=json;  //获得服务器里面的集合
                    }
                });
            },
            date(){
                $.getJSON({
                    type: "GET",  //提交类型必须与服务器要求的一致
                    url: "sche!queryByDate",   //远程服务器接口的地址请求后端
                    success: function (json) {
                        app.sche=json;  //获得服务器里面的集合
                    }
                });
            },
            card(){
               var idCard= $("#card").val();
                $.getJSON({
                    type: "GET",  //提交类型必须与服务器要求的一致
                    url: "pat!queryByCard",   //远程服务器接口的地址请求后端
                    data:{"patient.idCard":idCard},
                    success: function (json) {
                        if(json==null||json==""||json==undefined){
                            alert("就诊卡查询失败,请先创建就诊卡！")
                        }else{
                            app.cards=json;  //获得服务器里面的集合
                        }
                    }
                });
            },
            room(){
                var options=$("#sele option:selected").val(); //获取选中的项
                $.getJSON({
                    type: "GET",  //提交类型必须与服务器要求的一致
                    url: "sche!queryByRoom",   //远程服务器接口的地址请求后端
                    data:{"schedule.sysUsers.Id":options},
                    success: function (json) {
                        console.log(JSON.stringify(json));
                            app.rooms=json;  //获得服务器里面的集合
                        console.log(app.rooms[0].room.name);
                    }
                });
            }

        },mounted(){
            //从服务器拿数据
            this.goto();
            this.room();
            this.date();
            this.card();
        }
    });

</script>
</body>
</html>
